1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
|
import { generateOGImage } from '@/app/(main)/og/[...slug]/og';
import { getPostBySlug, getAllPostSlugs } from '@/lib/payload-posts';
import type { ImageResponse } from 'next/og';
import { notFound } from 'next/navigation';
async function loadAssets(): Promise<
{ name: string; data: Buffer; weight: 400 | 600; style: 'normal' }[]
> {
const [
{ base64Font: normal },
{ base64Font: mono },
{ base64Font: semibold },
] = await Promise.all([
import('./fonts/geist-regular-otf.json').then((mod) => mod.default || mod),
import('./fonts/geistmono-regular-otf.json').then(
(mod) => mod.default || mod,
),
import('./fonts/geist-semibold-otf.json').then((mod) => mod.default || mod),
]);
return [
{
name: 'Geist',
data: Buffer.from(normal, 'base64'),
weight: 400 as const,
style: 'normal' as const,
},
{
name: 'Geist Mono',
data: Buffer.from(mono, 'base64'),
weight: 400 as const,
style: 'normal' as const,
},
{
name: 'Geist',
data: Buffer.from(semibold, 'base64'),
weight: 600 as const,
style: 'normal' as const,
},
];
}
export async function GET(
request: Request,
{ params }: { params: Promise<{ slug: string[] }> }
): Promise<ImageResponse> {
const { slug } = await params;
const postSlug = slug[0];
if (!postSlug) {
notFound();
}
const post = await getPostBySlug(postSlug);
if (!post) {
notFound();
}
const fonts = await loadAssets();
return generateOGImage({
title: post.title,
description: post.description,
fonts,
});
}
export async function generateStaticParams(): Promise<{ slug: string[] }[]> {
const slugs = await getAllPostSlugs();
return slugs.map((slug) => ({ slug: [slug, 'image.png'] }));
}
|
